{include file="public/header" select="0" /}
<body>
<div class="title bgc">
    <i class="layui-icon layui-icon-left" onclick="load_href('{:url(\'user/index\')}',2)"></i>
    我的订单
</div>
<ul class="order-title">
    <li data-type=""  class="{if !$Request.param.type}active{/if}">全部</li>
    <li data-type="1" class="{if $Request.param.type == 1}active{/if}">待付款</li>
    <li data-type="2" class="{if $Request.param.type == 2}active{/if}">待发货</li>
    <li data-type="3" class="{if $Request.param.type == 3}active{/if}">待收货</li>
    <li data-type="4" class="{if $Request.param.type == 4}active{/if}">已完成</li>
</ul>

<ul class="index-join-container order-list tpl_list"></ul>
<script id="template" type="text/html">
    {{# for(var i=0;i<d.data.length ;i++){ }}
    <li class="bgc">
        <div class="order-num">订单号:{{d.data[i].sn}} <p>{{d.data[i].status}}</p></div>
        {{# for(var j=0;j<d.data[i].products.length ;j++){ }}
        <a href="{:url('order/my_order_details')}?id={{d.data[i].id}}">
            <img src="{{d.data[i].products[j].product_image}}" alt=""/>
            <div class="index-join-rgt">
                <p>{{d.data[i].products[j].product_title}}</p>
                <div>
                    <p>￥{{d.data[i].products[j].price}}</p>
                    <p>x{{d.data[i].products[j].num}}</p>
                </div>
            </div>
        </a>
        {{# } }}
        <div class="total">总价：￥{{d.data[i].real_amount}}</div>
        <div class="order-btn">
            <div>{{d.data[i].create_time}}</div>
            <div>
                {{# if(d.data[i].status == '待付款'){ }}
                <p style="border: 1px solid #999;color:#999;" data-id="{{d.data[i].id}}" class="clearOrder">取消订单</p>
                <p class="payment" data-id="{{d.data[i].id}}">去付款</p>
                {{# }else if(d.data[i].status == "待发货") { }}
                    {{# if(d.data[i].is_remind){ }}
                    <p style="border: 1px solid #999;color:#999;">已提醒发货</p>
                    {{# }else { }}
                    <p class="remind" data-id="{{d.data[i].id}}">提醒发货</p>
                    {{# } }}
                {{# }else if(d.data[i].status == "待收货") { }}
                <p class="receipt" data-id="{{d.data[i].id}}">确认收货</p>
                {{# }else { }}
                <p style="border: 1px solid #999;color:#999;">已完成</p>
                {{# } }}
            </div>
        </div>
    </li>
    {{# } }}
</script>
</body>
{include file="public/footer" select="0" /}
<script>
    $('.order-title li').click(function () {
        $(this).addClass('active').siblings().removeClass('active')
    })
    $(function () {
        getFlow('{$Request.param.type}', "{:url('order/getList')}");
        $(".order-title li").click(function () {
            $(".tpl_list").empty();
            var type = $(this).attr('data-type');
            getFlow(type, "{:url('order/getList')}");
        });

        $('.tpl_list').on('click', '.clearOrder', function () {
            const id = $(this).attr('data-id');
            edit('clear', id, '确认要取消订单吗？')
        }).on('click', '.remind', function () {
            const id = $(this).attr('data-id');
            edit('remind', id, '是否提醒发货？')
        }).on('click', '.payment', function () {
            const id = $(this).attr('data-id');
            _ajax('{:url("order/edit")}',{type: 'payment', id: id});
        }).on('click', '.receipt', function () {
            const id = $(this).attr('data-id');
            edit('receipt', id, '是否确认收货？')
        });

        function edit(type, id, msg) {
            layer.confirm(msg, {title: '请确认'}, function () {
                let load = layer.load(2);
                $.ajax({
                    type: 'POST',
                    url: '{:url("edit")}',
                    data: {type: type, id: id},
                    dataType: "json",
                    success: function (data) {
                        layer.close(load);
                        layer.msg(data.msg);
                        if (data.code == 1) {
                            $(".tpl_list").empty();
                            getFlow($(".active").attr('data-type'), "{:url('order/getList')}");
                        }
                    }
                });
            });
        }
    });

</script>
</html>